<template>
  <div style="padding:30px 25%;">
    <h1 style="text-align: center">{{title}}</h1>
    <el-row :gutter="15">
      <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
        <el-col :span="12">
          <el-form-item label="排序" prop="cmid">
            <el-input v-model="formData.cmid" placeholder="请输入排序" clearable :style="{width: '100%'}" :disabled='true'>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="车场名称" prop="mobile">
            <el-select v-model="formData.chid" placeholder="请输入车场名称" clearable :style="{width: '100%'}" @click-change="carsType">
              <el-option v-for="(item, index) in carshomeapilist" :key="index" :label="item.chname"
                         :value="item.chid" :disabled="item.disabled"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="套餐名称" prop="field120">
            <el-input v-model="formData.mealName" placeholder="请输入套餐名称" clearable :style="{width: '100%'}">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="套餐类型" prop="field104">
            <el-select v-model="formData.mealType" placeholder="请输入套餐类型" clearable :style="{width: '100%'}">
              <el-option v-for="(item, index) in mealTypeOptions" :key="index" :label="item.label"
                         :value="item.value" :disabled="item.disabled"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="套餐编号" prop="field103">
            <el-input v-model="formData.cmid" placeholder="请输入套餐编号" clearable :style="{width: '100%'}" :disabled='true'>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="生效时长" prop="field105">
            <el-input v-model="formData.validityTime" placeholder="请输入生效时长" clearable :style="{width: '100%'}">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="真实价格" prop="field106">
            <el-input v-model="formData.realPrice" placeholder="请输入真实价格" clearable :style="{width: '100%'}">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="原价" prop="field107">
            <el-input v-model="formData.originalPrice" placeholder="请输入原价" clearable :style="{width: '100%'}">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="库存" prop="field110">
            <el-input v-model="formData.inventory" placeholder="请输入库存" clearable :style="{width: '100%'}">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="销量" prop="field111">
            <el-input v-model="formData.salesVolume" placeholder="请输入销量" clearable :style="{width: '100%'}">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="车辆类型" >
            <el-select v-model="formData.ctid" clearable :disabled="formData.chid === null || formData.chid === '' || formData.chid === undefined">
              <el-option v-for="item in this.carTList" :key="item.carsType.ctid" :label="item.carsType.typeName" :value="item.carsType.ctid"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="备注" prop="field113">
            <el-input v-model="formData.remark" type="textarea" placeholder="请输入备注"
                      :autosize="{minRows: 1, maxRows: 4}" :style="{width: '100%'}"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item size="large">
            <el-button type="primary" @click="submitForm">提交</el-button>
            <el-button @click="back">返回</el-button>
          </el-form-item>
        </el-col>
      </el-form>
    </el-row>
  </div>
</template>
<script>
import { listMeal, getMeal, delMeal, addMeal, updateMeal, getCarsHomeApi } from "@/api/modules/meal/meal";
import {listCt} from "@/api/info/ct";
import {listHome, listProperty} from "@/api/ruoyi-home/home";
export default {
  components: {},

  props: [],
  data() {
    return {
      formData: {
      },
      mealTypeOptions: [{
        "label": "按天",
        "value": 1
      }, {
        "label": "按月",
        "value": 2
      }],
      carTList:[],
      carshomeapilist: [],
      rules: {

      },
      chid: {

      },
      title:"",

    }
  },
  computed: {},
  watch: {},
  created() {
    if (this.$route.query.data !=null){
      this.formData = this.$route.query.data;
    }
    this.getCarsHomeList();
    this.carsType();
    this.title = this.$route.query.title;
  },
  mounted() {},
  methods: {
    submitForm() {
      this.$refs['elForm'].validate(valid => {
        if (!valid) return
        // TODO 提交表单
        if(this.$route.query.data != null){
          updateMeal(this.formData).then(response =>{
            this.$modal.msgSuccess(response.msg);
            this.back();
          })
        }
        addMeal(this.formData).then(response =>{
          this.$modal.msgSuccess(response.msg);
          this.back();
        })
      })
    },
    back() {
      this.$store.dispatch('tagsView/delAllViews',this.$router);
      this.$router.push("meal_m");
    },
    getCarsHomeList() {
       getCarsHomeApi().then(response => {
        this.carshomeapilist = response.rows;
      }).catch(err => {
        alert("车场模块掉线")
      });
    },
    carsType() {
      this.chid.chid = this.formData.chid;
      this.formData.ctid = null;
      listCt(this.chid).then(res=>{
        this.carTList = res.rows;
      })
    },
  }
}

</script>
<style>
</style>
